<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<!-- Mobile Specific Meta -->
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<!-- Favicon-->
		<link rel="shortcut icon" href="img/fav.png">
		<!-- Author Meta -->
		<meta name="author" content="CodePixar">
		<!-- Meta Description -->
		<meta name="description" content="">
		<!-- Meta Keyword -->
		<meta name="keywords" content="">
		<!-- meta character set -->
		<meta charset="UTF-8">
		<!-- Site Title -->
		<title>Wedding</title>
		
		<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet"> 
			<link rel="stylesheet" href="css/linearicons.css">
			<link rel="stylesheet" href="css/font-awesome.min.css">
			<link rel="stylesheet" href="css/availability-calendar.css">
			<link rel="stylesheet" href="css/magnific-popup.css">
			<link rel="stylesheet" href="css/nice-select.css">
			<link rel="stylesheet" href="css/owl.carousel.css">
			<link rel="stylesheet" href="css/bootstrap.css">
			<link rel="stylesheet" href="css/main.css">
		<title></title>
	</head>
	<body>
		<header>
			<div class="container">
				<div class="header-wrap">
					<div class="header-top d-flex justify-content-between align-items-center">
						<div class="col menu-left">
							<a href="#">珞弈婚纱网站</a>
							<a href="#">luoyi.com</a>
						</div>
						<div class="col-3 logo">
							<a href="index.html"><img class="mx-auto" src="img/logo.png" alt=""></a>
						</div>
						 <nav class="col navbar navbar-expand-md justify-content-end">
		
						  <!-- Toggler/collapsibe Button -->
						  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
						    <span class="lnr lnr-menu"></span>
						  </button>
		
						  <!-- Navbar links -->
						  <div class="collapse navbar-collapse menu-right" id="collapsibleNavbar">
						    <ul class="navbar-nav">
						      <li class="nav-item">
						        <a class="nav-link" href="index.html">首页</a>
						      </li>
						      <li class="nav-item">
						        <a class="nav-link" href="index.html">关于我们</a>
						      </li>
						      <li class="nav-item">
						        <a class="nav-link" href="index.html">展示</a>
						      </li>
							   <!-- Dropdown -->
							    <li class="nav-item dropdown">
							      <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown">
							        更多
							      </a>
							      <div class="dropdown-menu">
							        <a class="dropdown-item" href="enrol.html">注册留言</a>
							        <a class="dropdown-item" href="http://localhost:8080/admin">管理员登录</a>
							      </div>
							    </li>							     					      
						    </ul>
						  </div>
						</nav> 
					</div>
				</div>
			</div>
		</header>
		<section class="reservation-area section-gap relative" id="reservation">
			<div class="container">
				<div class="overlay overlay-bg"></div>
				<div class="row headz justify-content-center">
					<div class="col-lg-6">
						<h1 class="text-white">预留信息</h1>
						<p>
							告诉我们您基本的信息，以便之后的婚纱选取和拍摄
						</p>							
					</div>
				</div>

				<form method="post" action="/reserve" onsubmit="reserve()">
					<div class="row no-padding justify-content-center mt-40">
						<div class="col-lg-8">
							<div class="row">
								<div class="col-lg-6 d-flex flex-column mb-20">
									<input name="name" placeholder="姓名" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Name'" class="form-control mt-20" required="" type="text">
								</div>
								<div class="col-lg-6 d-flex flex-column mb-20">
									<input name="phone" placeholder="电话" onfocus="this.placeholder = ''" onblur="this.placeholder = 'telephone'" class="form-control mt-20" required="">
								</div>

								<div class="col-lg-12 d-flex flex-column">
									<textarea class="form-control mt-20" name="message" placeholder="留言" onfocus="this.placeholder = ''" onblur="this.placeholder = 'leave a message'" required=""></textarea>
								</div>

								<div class="col-lg-12  justify-content-center  text-center">
									<button class="submit-btn primary-btn mt-20 text-uppercase" type="submit">确认</button>
								</div>

								<div class="alert-msg"></div>
							</div>
						</div>
					</div>
				</form>
			</div>	
		</section>
		<!-- End reservation Area -->
		<script>
			function reserve() {
				alert("预留成功");
			}
		</script>
	</body>
</html>
